<?php

$existing_users=array('roshan','mike','jason'); 
//value got from the get metho
$user_name=$_POST['username'];
if (!empty($user_name)) {
    //checking weather user exists or not in $existing_users array
    if (in_array($user_name, $existing_users))
    {
    //user name is not availble
    echo "no";
    } 
    else
    {
    //user name is available
    echo "yes";
    }
} else {
?>

<html>
<head>
<title>username validation</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript" language="javascript"></script>
<script language="javascript">

$(document).ready(function()
{
$("#username").blur(function()
{
//remove all the class add the messagebox classes and start fading
$("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn(" slow");
//check the username exists or not from ajax
$.post("sas2.php",{ username:$(this).val() } ,function(data)
{
alert(data);
if(data=='no') //if username not avaiable
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{ 
//add message and change the class of the box and start fading
$(this).html('This User name Already exists').addClass('messageboxerror').fadeTo(900,1);
});	
}
else
{
$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
{ 
//add message and change the class of the box and start fading
$(this).html('Username available to register').addClass('messageboxok').fadeTo(900,1);	
});
}

});

});
});
</script>
<style type="text/css">
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
}
.top {
margin-bottom: 15px;
}
.messagebox{
position:absolute;
width:100px;
margin-left:30px;
border:1px solid #c93;
background:#ffc;
padding:3px;
}
.messageboxok{
position:absolute;
width:auto;
margin-left:30px;
border:1px solid #349534;
background:#C9FFCA;
padding:3px;
font-weight:bold;
color:#008000;

}
.messageboxerror{
position:absolute;
width:auto;
margin-left:30px;
border:1px solid #CC0000;
background:#F7CBCA;
padding:3px;
font-weight:bold;
color:#CC0000;
}

</style>
</head>
<body>


<br>
<br>
<form method="post">
<div align="center">
<div class="top" > A fancy username availability checker using jQuery - <strong>Username &quot;roshan&quot;, &quot;mike&quot; ,&quot;jason&quot; already exists</strong><br>
Please move the focus out of the box to check the availability of username
</div>
<div >
User Name : <input name="username" type="text" id="username" value="" maxlength="15" />
<span id="msgbox" style="display:none"></span>
</div>

</div>
</form>
</body>
</html>i
<?php
}
?>
